<!doctype html>
<html class="no-js" lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>01-dati-anagrafici</title>
    <meta name="description" content="01-dati-anagrafici" />
    <link rel="stylesheet" href="css/app.css" />
    <script src="bower_components/modernizr/modernizr.js"></script>
  </head>
  <body>

    <nav>
      <ul>
        <li class="dashboard"><a href="#" title="pannello di controllo">pannello di controllo</a></li>
        <li class="help"><a href="#" title="hai bisogno di aiuto? contattaci">hai bisogno di aiuto? contattaci</a></li>
        <li class="guide"><a href="#" title="Consulta la guida">Consulta la guida</a></li>
      </ul>
    </nav>

    <div class="wrapper">
      <header class="row">
        <div class="large-12 columns title">
          <h1 class="logo">Arval <span class="light">ritira il tuo usato</span></h1>
        </div>
      </header>

      <div class="row arrow-down"></div>

       <div class="row">
        <div class="large-12 columns welcome">
          <h2 class="welcome-title">Dati anagrafici</h2>
          <p class="welcome-text gray-border">Inserici i tuoi dati et, consectetur adipiscing elit. Fusce ornare porttitor urna, non interdum tortorMauri</p>
        </div>
      </div>
      
      <div class="row">
        <div class="large-12 columns">
          <div class="right-align-text">i campi contrassegnati da * sono obbligatori</div>
        </div>
      </div>

      <form class="form-dati-anagrafici" name="dati-anagrafici" data-abide action="02-dati-auto.html">

        <div class="row form-section-title">
          <div class="large-12 columns">
            <h3 class="arrow-title">Dati personali</h3>
          </div>
        </div>

        <div class="row">
          <div class="large-6 columns form-left-column">
            <label>Nome*
              <input name="nome" type="text" required placeholder="" />
            </label>
          </div>
          <div class="large-6 columns form-right-column">
            <label>Cognome*
              <input name="cognome" type="text" required placeholder="" />
            </label>
          </div>
        </div>
        <div class="row">
          <div class="large-6 columns form-left-column">
            <label>Email*
              <input name="email" type="email" required placeholder="" />
            </label>
          </div>
          <div class="large-6 columns form-right-column">
            <label>Contatto telefonico*
              <input name="telefono" type="text" required placeholder="" />
            </label>
          </div>
        </div>

        <div class="row">
          <div class="large-12 columns form-separator">
            <div class="gray-border"></div>
          </div>
        </div>

        <div class="row form-section-title">
          <div class="large-12 columns">
            <h3 class="arrow-title">Dati societari</h3>
          </div>
        </div>

        <div class="row">
          <div class="large-8 columns form-left-column">
            <label>Ragione sociale*
              <input name="rs" type="text" required placeholder="" />
            </label>
          </div>
          <div class="large-4 columns form-right-column">
            <label>P. IVA*
              <input name="piva" type="text" required placeholder="" />
            </label>
          </div>
        </div>
        <div class="row">
          <div class="large-4 columns form-left-column">
            <label>Codice fiscale
              <input name="cf" type="text" placeholder="" />
            </label>
          </div>
          <div class="large-4 columns form-center-column">
            <label>Indirizzo
              <input name="indirizzo" type="text" placeholder="" />
            </label>
          </div>
          <div class="large-4 columns form-right-column">
            <label>Fax
              <input name="fax" type="text" placeholder="" />
            </label>
          </div>
        </div>
      

      <div class="row">
        <div class="large-12 columns errors">
          <div class="error-text"><span class="icon"></span>Attenzione, compila correttamente i campi in rosso</div>
        </div>
      </div>

      <div class="row arrow-down"></div>
       <div class="row">
        <div class="large-12 columns inserisci-dati">
          <button type="submit" class="button radius inserisci">inserisci i dati del veicolo<span class="icon"></span></button> 
        </div>
      </div>
    </form>

    </div>


    <div class="copy">&copy; Arval 2014</div>
    <footer><a href="#" title="ARVAL Bnp Paribas Group"></a></footer>

    <script src="bower_components/jquery/dist/jquery.min.js"></script>
    <script src="bower_components/foundation/js/foundation.min.js"></script>
    <script src="js/app.js"></script>
  </body>
</html>
